<?php
$this->headScript()->appendFile('/scripts/jquery/jquery.jstree.js');
$this->headScript()->appendFile('/scripts/jquery/jquery.cookie.js');
$this->headScript()->appendFile('/scripts/jquery/jquery.hotkeys.js');
?>
<SCRIPT type="text/javascript">
<!--
$(function (){
    var postAction = {
        save : '/system/menu/modify/do/save',
        delete : '/system/menu/modify/do/delete',
        move : '/system/menu/modify/do/move',
        checkResource: '/system/menu/modify/do/resource'
    };
    var $form = $('#jstree-form').dialog({
        autoOpen: false,
        modal: true,
        title: '菜单属性',
        buttons: {
            "确定": function (){
                var self = this;
                $.post(postAction.save, $form.serialize(), function (data){
                    if (data.statusCode) return ;
                    var $obj = $('#ig-jstree-'+data.params.id),
                        old_type = $obj.data('jstree');

                    $obj.data('jstree', $.extend( $obj.data('jstree'), data.params));
                    if (data.params.type != old_type) {
                        $jstree.jstree('set_type', data.params.type, $obj);
                    }
                    $form.dialog("close");
                });
            }
        }
    });

    var $jstree = $("#jstree").jstree({
        "json_data":{
            "data": <?=$this->jstree()->toJstreeData($this->data, 0, true)?>
        },
        "themes":{"theme":"default","url":"\/style\/jquery.jsTree\/default\/style.css"},
        //"ui":{"select_limit":1},
        "types":{
            "types":{
                "default":{
                    "valid_children" : "none",
                    "icon":{"image":"\/style\/jquery.jsTree\/default\/file.png"}
                },
                "folder":{
                    "valid_children" : [ "default", "folder" ],
                    "icon":{"image":"\/style\/jquery.jsTree\/default\/folder.png"}
                },

                "drive":{
                    "valid_children" : [ "default", "folder", "drive" ],
                    "icon":{"image":"\/style\/jquery.jsTree\/default\/root.png"}
                }
            }
        },
        "hotkeys": {
            "del": function (){ if (confirm( "确定删除？")) this.remove(); }
        },
        "plugins":["themes", "json_data", "ui", "crrm", "cookies", "dnd", "search", "types", "hotkeys", "contextmenu"],
        "contextmenu":{
            "items": function (obj){
                return {
                    "create":{
                        "label":"创建",
                        "_disabled" : obj.attr('rel') == 'default',
                        "separator_after" : true,
                        "submenu" : {
                            "folder" : {
                                "label":"文件夹",
                                "action": function (obj){
                                    var json_data = {
                                        data: '未命名',
                                        attr: { rel: 'folder' }
                                    };
                                    this.create(obj, 'last', json_data);
                                }
                            },
                            "default" : {
                                "label":"URL节点",
                                "action": function (obj){
                                    var json_data = {
                                        data: '未命名',
                                        attr: { rel: 'default' }
                                    };
                                    this.create(obj, 'last', json_data);
                                }
                            }
                        }
                    },
                    "rename" : {
                        "label":"重命名", "action": function (){ this.rename(); }
                    },
                    "remove" : {
                        "label":"删除",
                        "action" : function (){ if (confirm( "确定删除？")) this.remove(); }
                    },
                    "properties" : {
                        "separator_before"  : true,
                        "label" : "属性",
                        "action" : function (obj) {
                            var d = obj.data('jstree');
                            $form.dialog('open').find('input').val(function (){
                                return d[this.name.slice(7,-1)];
                            })
                            .end().find('[name="params[type]"]')
                                  .attr('disabled', d.type != 'folder')
                                  .find('> option[value='+d.type+']')
                                  .attr('selected', true)
                                  .siblings()
                                  .removeAttr('selected');
                            $form.find('span').html(obj.find('> a').text());
                        }
                    }
                };
            },
            select_node:true
        }
    }).bind('rename.jstree', function (event, data){
        var id = data.rslt.obj.data('jstree').id,
            new_name = data.rslt.new_name,
            old_name = data.rslt.old_name;

        if (new_name != old_name) {
            $.post(postAction.save, 'params[id]='+id+'&params[title]='+new_name, function (result){
                if (result.statusCode) {
                    $.jstree.rollback(data.rlbk);
                    return ;
                }

                data.rslt.obj.data('jstree', $.extend( data.rslt.obj.data('jstree'), {'title':new_name}));
            });
        }
    }).bind('remove.jstree', function (event, data){
        var id = data.rslt.obj.attr('id').split(/-/)[2];
        $.post(postAction.delete, 'id='+id, function (result){
            if (result.statusCode) $.jstree.rollback(data.rlbk);
        });
    }).bind('create.jstree', function (event, data){
        var rslt = data.rslt, top_parent_id, parent_id;

        if (rslt.name == '未命名') {
            $.jstree.rollback(data.rlbk);
            return ;
        }

        if (rslt.parent == -1) {
            top_parent_id = parent_id = 0;
        } else {
            var jstree_data = rslt.parent.data('jstree');
        	parent_id     = jstree_data.id;
        	top_parent_id = parseInt(jstree_data.top_parent_id) ?
                            jstree_data.top_parent_id : parent_id;
        }

        var params = 'params[title]='+rslt.name
                   + '&params[parent_id]='+parent_id
                   + '&params[top_parent_id]='+top_parent_id
                   + '&params[type]='+rslt.obj.attr('rel')
                   + '&params[position]='+rslt.position;
        $.post(postAction.save, params, function (result){
            if (result.statusCode) {
                $.jstree.rollback(data.rlbk);
                return ;
            }
            rslt.obj.data('jstree', result.params);
            rslt.obj.attr('id', 'ig-jstree-'+result.params.id);
        });
    }).bind('move_node.jstree', function (event, data) {
        var rslt = data.rslt,
            after_parent = rslt.np,
            before_parent = rslt.op,
            params = {
                "current": rslt.o.data('jstree').id,
                "after_parent": after_parent.data('jstree').id
            },
            after_node = [];

        after_parent.find("> ul > li").each(function (){
            var $this = $(this);
            after_node[$this.index()] = $this.data('jstree').id;
        });

        params.after_node = after_node;

        if (before_parent.data('jstree').id != after_parent.data('jstree').id) {
            params.before_parent = before_parent.data('jstree').id;
        }
        $.post(postAction.move, params, function (result){
            if (result.statusCode) {
                $.jstree.rollback(data.rlbk);
                return ;
            }
        });
        return ;
    });

    $('[name="params[permission]"]').focus(function (){
        var url = $('[name="params[url]"]').val()
            self = this;
        if (/^\/[a-z]/.test(url)) {
            $.post(postAction.checkResource, {'do':'resource', 'url': url}, function (result){
                if (result.statusCode) return ;
                self.value = result.id;
            });
        }
    });

    $('#add-module').click(function (){
        var json_data = {
            data: '未命名',
            attr: { rel: 'drive' }
        };
        $jstree.jstree('create', -1, 'drive', json_data);
    });

});
//-->
</SCRIPT>
<FORM method="post" action="" id="jstree-form" class="hide param">
    <INPUT type="hidden" name="params[id]">
    <p><label>菜单名</label><span></span></p>
    <p><label>URL</label><INPUT type="text" name="params[url]" /></p>
    <p><label>关联权限</label><INPUT type="text" name="params[permission]" /></p>
    <p><label>文件夹图标</label>
        <select name="params[type]">
            <option value="folder">默认</option>
            <option value="folder">蜀门</option>
            <option value="folder">醉逍遥</option>
            <option value="folder">石器部落</option>
        </select></p>
</FORM>
<INPUT type="button" value="增加模块" id="add-module">
<HR>
<div id="jstree"></div>